<template>
    <div class="h-full">
      <el-button size="small" @click="show" class="mar-tb-10px">查看</el-button>
      <mavon-editor v-model="section.strength"
                    :ishljs="true"
                    :tabSize="2"
                    ref="md"
                    @imgAdd="imgAdd" @imgDel="imgDel"
                    :codeStyle="codeStyle" @save="updateSection()"/>
    </div>

</template>

<script>

import ApiResponse from "utils/ApiResponse"
import oss from "@/api/commons/upload/oss"
import v2Header from "components/v2-cps/v2-header";
import contentex from "api/learn/contentex";
export default {
  components: {v2Header},
  data(){
        return{
            codeStyle: 'idea',
            section: {
              id: null ,
              strength: ''
            } ,
            toolbars:{
                htmlCode: false,
                code: true, // code
                table: true, // 表格
                preview: true, // 预览
                navigation: true, // 导航目录
            },
            images:{}
        }
    },
    created: function () {

     this.getSection();
    },

    methods:{
        show(){
          this.$router.replace('/section/'+this.$route.query.id)
        },
        imgAdd(pos, file){
          let fd = new FormData() ;
          fd.append("file" ,file )
          oss.upload(fd).then(res=>{
            ApiResponse.init(res).ok((data)=>{
              this.$refs.md.$img2Url(pos,data);
            }).print()
          })
        },
        imgDel(objs){
          return false
        },
        changeSections(value){


        },
        getSection(){
          let id = this.$route.query.id ;
          contentex.detail(id).then(res=>{
            new ApiResponse(res).ok((data)=>{
              this.section.id = data.id ;
              this.section.strength = data.strength || '' ;
              this.section.cxId = data.cxId
            })
          })
        },
        back(){
            this.$router.back()
        },
        updateSection(){
          console.log(this.section)
          contentex.update(this.section).then(res=>{
            new ApiResponse(res).ok((data)=>{
              this.getSection() ;
            }).print()
          })
        }
    },
  computed:{

  }
}
</script>

<style>
    .markdown-body {
        width: 100%;
        height: 700px;
    }
    .el-form-item{
        margin-bottom: 10px;
    }

</style>
